<template>
    <div class="sub-div-center">
        <!-- logo区域 -->
        <div class="logo">
            <div class="logo1">

            </div>

            <div class="logo2">
                <ul>
                    <li class="logo2-li1">
                        SINOTRUK GROUP
                    </li>
                    <li class="logo2-li2">
                        <span>No.1 Expert Truck & Spare Parts Brand in China</span>
                    </li>
                </ul>
            </div>
        </div>
    </div>

</template>
<script setup>
</script>
<style scoped>

.logo {
    width: var(--content-width);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}


.logo1 {
    --logosize: 150px;
    width: var(--logosize);
    height: var(--logosize);
    background-color: red;
    margin-right: 1vw;
}

.logo2 {
    width: 65%;
    margin-left: 1vw;
}

.logo2-li1{
 font-size: 1.8rem;
 border-bottom:1px solid #000000  ;
 font-weight: 600;
}

.logo2-li2{
 font-size: 1rem;
 color: #ccc;
 font-style: italic;
 display: flex;
 justify-content: flex-end;
}
</style>